<template>
		<s-layout  navbar="inner1" :bgStyle="{ color: 'transparent' }">
			<view class="content">
				<assNavbar title="收款二维码" :background="{
					img: sheep.$url.cdn('/storage/giveaway/20250314/2ddcedf3c1a5d0fac0c300e6073840c7.png'),
					BGcolor: 'transparent'
				}" />
				<image class="bgTop"
					:src="sheep.$url.cdn('/storage/giveaway/20250314/2ddcedf3c1a5d0fac0c300e6073840c7.png')"
					mode="widthFix" />
				<view class="code-card">
					<image :src="sheep.$url.cdn('/static/icon/payfee.png')" class="code-img"></image>
					<view class="btn">保存二维码</view>
				</view>	
				<view class="tips">
					<view class="tips-label">购买语音播报小音箱</view>
					<view class="tips-btn" @click="gotobuy">去购买</view>
				</view>
			</view>
			
		</s-layout>
</template>

<script setup>
import {
	computed,
	reactive,
	ref
} from 'vue';
import {
	onLoad,
	onShow,

} from '@dcloudio/uni-app';

import sheep from '@/sheep';
import assNavbar from "@/components/ass-navbar.vue"

function gotobuy(){
	
}

</script>

<style lang="scss" scoped>
.bgTop {
	width: 100%;
	height: 331rpx;
	margin-top: v-bind('-sys_navBar + "px"');
	margin-bottom: -200rpx;
	background-color: #a6c4f7;
	background-image: linear-gradient(180deg, #a6c4f7 5%, #d7d2fa 68%, #ffffff 100%);

}
.code-card{
	position:absolute;
	top:130rpx;
	width:calc(100% - 40rpx - 65rpx - 10rpx);
	margin:10rpx 20rpx 25rpx 20rpx;
	background: #fff;
	padding:31rpx 37rpx 27rpx 38rpx;
	height: 812rpx;
	z-index:3;
	border-radius: 24px;
	
	display:flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
	
	
}
.code-img{
	width: 277px;
	height: 276px;
	margin-top:32rpx;
}
.btn{
	margin-top:32rpx;
	width: 358rpx;
	height: 80rpx;
	border-radius: 40rpx;
	background: linear-gradient(283deg, #05D5BF 0%, #06C2AE 50%, #A2CEFD 100%);
	
	display:flex;
	justify-content: center;
	align-items: center;
	
	font-family: Source Han Sans;
	font-size: 32rpx;
	font-weight: 500;
	line-height: normal;
	letter-spacing: normal;
	color: #FFFFFF;
}
.tips{
	position:absolute;
	top:1092rpx;
	background-color: #fff;
	margin: 25rpx 19rpx 0 17rpx;
	width:calc(100% - 36rpx - 40rpx);
	height:52rpx;
	border-radius: 8px;
	display:flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	padding:20rpx;
	.tips-label{
		font-family: Source Han Sans;
		font-size: 32rpx;
		font-weight: 500;
		line-height: normal;
		text-align: right;
		letter-spacing: normal;
		color: #3D3D3D;
	}
	.tips-btn{
		width:140rpx;
		height: 72rpx;
		border-radius: 8rpx;
		background: #E28802;
		
		display: flex;
		justify-content: center;
		align-items: center;
		
		font-family: Source Han Sans;
		font-size: 28rpx;
		font-weight: 500;
		line-height: normal;
		text-align: right;
		letter-spacing: normal;
		color: #FFFFFF;
	}
}

</style>
